<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>主菜单</title>
        <link rel="stylesheet" type="text/css" href="../css/aui.css" />
        <script type="text/javascript" src="../script/api.js"></script>
        <script src="../script/aui-tab.js"></script>
        <script src="../script/jquery.js"></script>
        <script src="../CommonTool/commonNetWork.js"></script>
    </head>
    <style>
        .marginBody {
            margin-top: 0.6rem;
            min-height: 10rem;
            max-height: 10rem;
            margin-bottom: 0rem;
        }
        .userSetting {
            margin: 0 auto;
            width: 3.5rem;
            height: 4rem;
        }
        .SubsetBody {
            margin: 0 auto;
            width: 7.5rem;
            height: 4rem;
            line-height: 4rem;
            background: rgba(237, 233, 199, 1);
            border-radius: 0.2rem;
            font-size: 1rem;
        }
        .SceneSetting {
            margin: 0 auto;
            width: 7rem;
            height: 4rem;
        }
        .footerBottom {
            width: 100%;
            height: 1.5rem;
            line-height: 1.5rem;
            background: rgba(229, 229, 229, 1);
            position: fixed; /* 或者使用 absolute */
            bottom: 0;
            left: 0;
        }
        /* for huawei matepad  */
        @media (max-width: 1024px) and (orientation: landscape) {
            .row-margin {
                margin-top: 2%;
            }
        }
        @media (min-width: 1240px) and (orientation: landscape) {
            .row-margin {
                margin-top: 5%;
            }
        }
    </style>
    <body>
        <header class="aui-bar aui-bar-nav" id="aui-header"></header>

        <div id="MainMenuBody">
            <div class="aui-grid marginBody">
                <div class="aui-row row-margin">
                    <div class="aui-col-xs-4">
                        <br />
                        <img
                            src="http://172.16.32.194/HomePage/1.png"
                            alt=""
                            class="userSetting"
                            onclick="Questionnaire()"
                        />

                        <p>用户评估</p>
                    </div>
                    <div class="aui-col-xs-4">
                        <!-- <img id="user-info-avatar" src="../image/head.png" alt="" class="userSetting" /> -->
                        <!-- onclick="PersonSetting()" -->
                        <p id="sname" style="font-size: 80px; font-weight: bold">用户名</p>
                    </div>
                    <div class="aui-col-xs-4">
                        <br />
                        <img
                            src="http://172.16.32.194/HomePage/3.png"
                            alt=""
                            class="userSetting"
                            onclick="TrainingRecord()"
                        />
                        <p>训练记录</p>
                    </div>
                </div>

                <div class="aui-row row-margin">
                    <div class="aui-col-xs-1"></div>
                    <div class="aui-col-xs-4">
                        <img src="../image/basic.png" alt="" class="SceneSetting" onclick="MiddleMenu()" />
                        <p>初级训练</p>
                    </div>
                    <div class="aui-col-xs-2"></div>
                    <div class="aui-col-xs-4">
                        <img src="../image/middle.png" alt="" class="SceneSetting" onclick="AdvancedMenu()" />
                        <p>中级训练</p>
                    </div>
                </div>
            </div>
        </div>
        <div id="MeMenuBody">
            <div class="aui-container" id="frm-container">
                <ul class="aui-list aui-list-in" style="background: none">
                    <li class="aui-list-item" onclick="profile_pic();">
                        <div class="aui-list-item-inner aui-list-item-arrow" style="min-height: 2.5rem">
                            <div class="aui-list-item-title">&nbsp;头像</div>
                            <div class="aui-list-item-right">
                                <div style="position: relative; top: 0; left: 0">
                                    <img
                                        id="user-info-avatar1"
                                        src="../image/head.png"
                                        style="width: 2.5rem; height: 2.5rem"
                                    />
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item" onclick="SetName()">
                        <div class="aui-list-item-inner aui-list-item-arrow" style="min-height: 2.5rem">
                            <div class="aui-list-item-title">&nbsp;用户名</div>
                            <div class="aui-list-item-right">
                                <div id="user-info-username" style="position: relative; top: 0; left: 0"></div>
                            </div>
                        </div>
                    </li>
                    <!-- <li class="aui-list-item" onclick="PhoneClick()">
                <div class="aui-list-item-inner aui-list-item-arrow" style="min-height:2.5rem">
                    <div class="aui-list-item-title">&nbsp;手机号</div>
                    <div class="aui-list-item-right">
                        <div id="user-info-burdentype"style="position:relative;top:0; left:0"></div>
                    </div>
                </div>
            </li> -->
                    <li class="aui-list-item" onclick="ResetPassword()">
                        <div class="aui-list-item-inner aui-list-item-arrow" style="min-height: 2.5rem">
                            <div class="aui-list-item-title">&nbsp;修改密码</div>
                            <div class="aui-list-item-right">
                                <div id="user-info-burdentype" style="position: relative; top: 0; left: 0"></div>
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item" onclick="GenderClick()">
                        <div class="aui-list-item-inner aui-list-item-arrow" style="min-height: 2.5rem">
                            <div class="aui-list-item-title">&nbsp;性别</div>
                            <div class="aui-list-item-right">
                                <div id="user-info-sex" style="position: relative; top: 0; left: 0"></div>
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item" onclick="dateSelect()">
                        <div class="aui-list-item-inner aui-list-item-arrow" style="min-height: 2.5rem">
                            <div class="aui-list-item-title">&nbsp;生日</div>
                            <div class="aui-list-item-right">
                                <div id="user-info-birthday" style="position: relative; top: 0; left: 0"></div>
                            </div>
                        </div>
                    </li>
                    <!-- <li class="aui-list-item" onclick="citySelect()">
                <div class="aui-list-item-inner aui-list-item-arrow" style="min-height:2.5rem">
                    <div class="aui-list-item-title">&nbsp;地域</div>
                    <div class="aui-list-item-right">
                        <div id="user-info-province"style="position:relative;top:0; left:0"></div>
                    </div>
                </div>
            </li> -->
                </ul>
                <div
                    class="aui-btn aui-btn-block"
                    style="
                        margin: 0 auto;
                        margin-top: 1rem;
                        background-color: #f96d73 !important;
                        width: 80%;
                        color: white;
                    "
                    tapmode
                    onclick="logout_clicked();"
                >
                    <strong>退出登录</strong>
                </div>
            </div>
        </div>
        <footer class="aui-bar aui-bar-tab footerBottom" id="TabMenuStyle">
            <div class="aui-bar-tab-item aui-active">
                <i class="aui-iconfont aui-icon-home"></i>
                <div class="aui-bar-tab-label">发现</div>
            </div>
            <div class="aui-bar-tab-item"></div>
            <div class="aui-bar-tab-item">
                <i class="aui-iconfont aui-icon-my"></i>
                <div class="aui-bar-tab-label">我的</div>
            </div>
        </footer>
    </body>
</html>
<script>
    var token = "";
    var userid = "";
    var sname = "";
    var keyid = "";
    var avatarUrl;
    var currentTimestamp = "";
    var operationName = "";
    var additionalInfo = "";
    var groupId = "";
    var scene = "主界面";
    var sceneLevel = "";
    var courseType = "";
    var classSort = "";
    var moodType = "";
    var remarks = "";
    var classType = "";
    apiready = function () {
        document.getElementById("MainMenuBody").style.display = "block";
        document.getElementById("MeMenuBody").style.display = "none";
        token = api.pageParam.token;
        userid = api.pageParam.uid;
        sname = api.pageParam.sname;
        keyid = api.pageParam.keyid;
        getAvatar();
        var currentTimestamp = Date.now();
        operationName = "";
        additionalInfo = "";
        CommonNetWork();
        if (sname === undefined) {
            sname = $api.getStorage("sname");
        } else {
            $api.setStorage("sname", sname);
        }
        document.getElementById("sname").innerText = sname;
    };
    var tab = new auiTab(
        {
            element: document.getElementById("TabMenuStyle"),
        },
        function (ret) {
            if (ret.index == 1) {
                document.getElementById("MainMenuBody").style.display = "block";
                document.getElementById("MeMenuBody").style.display = "none";
                getAvatar();
            } else if (ret.index == 3) {
                document.getElementById("MainMenuBody").style.display = "none";
                document.getElementById("MeMenuBody").style.display = "block";
                $api.byId("user-info-username").innerText = sname;
                getAvatar();
            }
        }
    );
    function getAvatar() {
        $.ajax({
            url: CommonUrl + "/tSysUser/queryById?id=" + keyid,
            method: "get",
            dataType: "json",
            contentType: "application/json",
            headers: {
                Authorization: `Bearer ${token}`,
                CacheControl: "no-cache",
            },
            success: function (data) {
                avatarUrl = JSON.parse(JSON.stringify(data.data.imageUrl));
                $api.byId("user-info-avatar").src = avatarUrl;
                $api.byId("user-info-avatar1").src = avatarUrl;
            },
            error: function (err) {
                alert(JSON.stringify(err) + "打印头像失败");
            },
        });
    }
    function BasicMenu() {
        api.openWin({
            name: "SubsetMenu-Basics",
            url: "./SubsetMenu-Basics.html",
            reload: true,
            pageParam: {
                uid: userid,
                token: token,
            },
        });
    }
    function MiddleMenu() {
        api.openWin({
            name: "SceneMenu-Middle",
            url: "./SceneMenu-Middle.html",
            reload: true,
            pageParam: {
                uid: userid,
                token: token,
            },
        });
    }
    function AdvancedMenu() {
        api.openWin({
            name: "SceneMenu-Advanced",
            url: "./SceneMenu-Advanced.html",
            reload: true,
            pageParam: {
                uid: userid,
                token: token,
            },
        });
    }
    function Questionnaire() {
        api.openWin({
            name: "Questionnaire",
            url: "./Questionnaire/QuestionnaireMain.html",
            pageParam: {
                uid: userid,
                token: token,
            },
            reload: true,
        });
    }
    function TrainingRecord() {
        api.openWin({
            name: "TrainingRecord",
            url: "./TrainingRecord.html",
            pageParam: {
                uid: userid,
                token: token,
            },
            reload: true,
        });
    }
    //用户名设置
    function PersonSetting() {
        api.openWin({
            name: "UserNameSetting",
            url: "./UserNameSetting/UserNameMain.html",
            pageParam: {
                uid: userid,
                token: token,
                keyid: keyid,
            },
            reload: true,
        });
    }

    function logout_clicked() {
        // $api.setStorage("wxInfo", "");
        api.confirm(
            {
                title: "退出提示",
                msg: "确认要退出程序吗？",
                buttons: ["确定", "取消"],
            },
            function (ret, err) {
                var index = ret.buttonIndex;
                if (index == "1") {
                    api.openWin({
                        name: "login",
                        url: "./login.html",
                        reload: true,
                    });
                } else {
                }
            }
        );
    }
    function profile_pic() {
        api.openWin({
            name: "profile_pic",
            url: "./UserInfo/profile_pic.html",
            reload: true,

            pageParam: {
                login_user_info: {
                    userID: userid,
                },
                token: token,
                uid: userid,
                keyid: keyid,
                avatarUrl: avatarUrl,
            },
        });
    }
    function GenderClick() {
        api.openWin({
            name: "gender",
            url: "./UserInfo/gender.html",
            reload: true,
        });
    }
    // function PhoneClick(){
    //     api.openWin({
    //         name: 'phone',
    //         url:'./UserInfo/phone.html',
    //         reload:true
    //     })
    // }
    function ResetPassword() {
        api.openWin({
            name: "resetpassword",
            url: "./UserInfo/resetpassword.html",
            reload: true,
        });
    }
    function SetName() {
        api.openWin({
            pageParam: {
                login_user_info: {
                    userID: userid,
                },
                token: token,
                uid: userid,
                keyid: keyid,
            },
            name: "SetName",
            url: "./UserInfo/SetName.html",
            reload: true,
        });
    }
    function dateSelect() {
        api.openPicker(
            {
                type: "date_time",
                date: "1990-01-01 00:00",
                title: "选择生日",
            },
            function (ret, err) {
                if (ret) {
                    //post to db
                    birthday_date = ret.year + "-" + ret.month + "-" + ret.day;
                    $api.html($api.byId("user-info-birthday"), birthday_date);
                    api.ajax(
                        {
                            url: $api.getStorage("api_url") + "/lansys/user/saveBirthday",
                            method: "post",
                            timeout: 5,
                            data: {
                                values: {
                                    uid: login_user_info.userID,
                                    value: birthday_date,
                                },
                            },
                        },
                        function (ret, err) {
                            if (ret) {
                                api.toast({
                                    msg: "生日设置成功！",
                                    duration: 2000,
                                    location: "bottom",
                                });
                                jsfun = "get_current_user_info(login_user_info.userID);";
                                api.execScript({
                                    name: "mainPage",
                                    frameName: "main_frm_me",
                                    script: jsfun,
                                });
                                //alert( JSON.stringify( ret ) );
                            } else {
                                // alert( JSON.stringify( err ) );
                            }
                        }
                    );

                    //alert(JSON.stringify(ret));
                } else {
                    alert(JSON.stringify(err));
                }
            }
        );
    }
    function citySelect() {
        var UIActionSelector = api.require("UIActionSelector");
        UIActionSelector.open(
            {
                datas: "widget://res/city.json",
                layout: {
                    row: 5,
                    col: 3,
                    height: 30,
                    size: 12,
                    sizeActive: 14,
                    rowSpacing: 5,
                    colSpacing: 10,
                    maskBg: "rgba(0,0,0,0.2)",
                    bg: "#fff",
                    color: "#888",
                    colorActive: "#f00",
                    colorSelected: "#f00",
                },
                animation: true,
                cancel: {
                    text: "取消",
                    size: 12,
                    w: 90,
                    h: 35,
                    bg: "#fff",
                    bgActive: "#ccc",
                    color: "#888",
                    colorActive: "#fff",
                },
                ok: {
                    text: "确定",
                    size: 12,
                    w: 90,
                    h: 35,
                    bg: "#fff",
                    bgActive: "#ccc",
                    color: "#888",
                    colorActive: "#fff",
                },
                title: {
                    text: "请选择",
                    size: 12,
                    h: 44,
                    bg: "#eee",
                    color: "#888",
                },
                fixedOn: api.frameName,
            },
            function (ret, err) {
                if (ret) {
                    if (ret.eventType == "ok") {
                        province = ret.level1 + "-" + ret.level2 + "-" + ret.level3;
                        console.log(province);

                        $api.html($api.byId("user-info-province"), province);
                        province = encodeURI(province);
                        api.ajax(
                            {
                                url: $api.getStorage("api_url") + "/lansys/user/saveProvince",
                                method: "post",
                                timeout: 5,
                                data: {
                                    values: {
                                        uid: login_user_info.userID,
                                        value: province,
                                    },
                                },
                            },
                            function (ret, err) {
                                if (ret) {
                                    api.toast({
                                        msg: "地域设置成功！",
                                        duration: 2000,
                                        location: "bottom",
                                    });
                                    jsfun = "get_current_user_info(login_user_info.userID);";
                                    api.execScript({
                                        name: "mainPage",
                                        frameName: "main_frm_me",
                                        script: jsfun,
                                    });
                                    //alert( JSON.stringify( ret ) );
                                } else {
                                    //alert( JSON.stringify( err ) );
                                }
                            }
                        );
                    }
                    //alert(JSON.stringify(ret));
                } else {
                    alert(JSON.stringify(err));
                }
            }
        );
    }
</script>
